/**
 * Created by alan on 2017/4/27.
 * 降雨信息
 */
Ext.define("Admin.view.baseInfo.ddsDrWq", {
    extend: "Ext.container.Container",
    xtype: "ddsDrWq",
    requires: [
        "Admin.store.baseInfo.DdsDrWq",
    ],
    //起别名
    alias: "ddsDrWq",
    controller: "ddsDrWqController",
    userCLs: "big-100 small-100",
    layout: "fit",
    height: 200,
    items: {
        xtype: "panel",
        // layout: "anchor",
        cls: "dashboard-main-chart shadow",
        width: "100%",
        height: 200,
        margin: 7,
        bodyPadding: 7,
        layout: {
            type: "vbox",
            align: "stretch" //拉伸使其充满整个父容器
        },
        items: [{
                tbar: [{
                        xtype: "combobox",
                        labelWidth: 60,
                        fieldLabel: "测站名称",
                        reference: "stcd",
                        displayField: "stnm",
                        queryMode: "local",
                        valueField: "stcd",
                        triggerAction: "all",
                        anyMatch: true,
                        listeners: {
                            added: function(combo) {
                                var _that = this;
                                var store = Ext.create("Ext.data.Store", {
                                    fields: ["river", "stnm", "stcd"],
                                    data: wqstList
                                });
                                store.clearFilter();
                                store.filter({
                                    property: "river",
                                    value: config.RIVER
                                });
                                combo.setStore(store);
                                combo.setValue(store.getData().items[0] ? store.getData().items[0].data.stcd : "");
                            }
                        }
                    },
                    {
                        xtype: "combobox",
                        labelWidth: 60,
                        fieldLabel: "水质指标",
                        id: 'norm',
                        reference: "norm",
                        editable: false,
                        displayField: "label",
                        queryMode: "local",
                        valueField: "value",
                        triggerAction: "all",
                        anyMatch: true,
                        listeners: {
                            added: function(combo) {
                                var _that = this;
                                var store = Ext.create("Ext.data.Store", {
                                    fields: ["norm"],
                                    data: [{ 'label': '水温(℃)', 'value': '1' }, { 'label': 'PH(无量纲)', 'value': '2' }, { 'label': '化学需氧量(mg/L)', 'value': '3' }, { 'label': '高锰酸盐(mg/L)', 'value': '4' }, { 'label': '氨氮(mg/L)', 'value': '5' }, { 'label': '总磷(mg/L)', 'value': '6' }]
                                });
                                combo.setStore(store);
                                combo.setValue(1);
                            }
                        }
                    },
                    {
                        xtype: "datefield",
                        margin: "0 10 0 10",
                        maxWidth: 220,
                        fieldLabel: "时间",
                        format: "Y-m-d",
                        // editable: false,
                        maxValue: new Date(),
                        // value: config.defaultStartDate,
                        value: config.defaultStartDate,
                        labelWidth: 40,
                        reference: "startTm",
                        listeners: {
                            change: function() {
                                var edDt = this.nextSibling().nextSibling();
                                edDt.setMinValue(this.value);
                            }
                        }
                    },
                    "--",
                    {
                        xtype: "datefield",
                        maxWidth: 220,
                        // value: config.defaultEndDate,
                        format: "Y-m-d",
                        // editable: false,
                        value: config.defaultEndDate,
                        maxValue: new Date(),
                        reference: "endTm"
                    },
                    {
                        xtype: "button",
                        text: "查询",
                        iconCls: "x-fa  fa-file-o",
                        handler: "check",
                        margin: "0 10 0 10",
                        style: "border-radius:4px;-webkit-border-radius: 4px;"
                    }
                ],
                height: 60
            },
            {
                xtype: "panel",
                title: "水质信息",
                height: "100%",
                border: true,
                flex: 1,
                layout: {
                    type: "hbox",
                    align: "stretch"
                },
                items: [{
                        xtype: "component",
                        id: 'inforChart5',
                        reference: "chart",
                        flex: 1,
                        highchart: null,
                        height: "100%",
                        border: 1,
                        style: {
                            borderColor: "#ccc",
                            borderStyle: "solid"
                        },
                        html: '<div id="ddsDrWqChart" style="height: 100%;" ></div>',
                        listeners: {
                            afterRender: function(dom) {
                                var me = this;
                                var domId = document.getElementById("ddsDrWqChart");
                                me.highchart = new Highcharts.Chart({
                                    chart: {
                                        type: 'spline',
                                        renderTo: domId
                                    },
                                    title: {
                                        text: ""
                                    },
                                    xAxis: {
                                        categories: []
                                    },
                                    legend: {
                                        align: "center",
                                        verticalAlign: "top"
                                    },
                                    yAxis: {
                                        title: {
                                            text: "水温(℃)"
                                        }
                                    },
                                    tooltip: {
                                        valueSuffix: ""
                                    },
                                    series: [{
                                        name: "水温(℃)",
                                        connectNulls: true,
                                        data: []
                                    }]
                                });
                            },
                            resize: function(me, width, height) {
                                this.highchart.setSize(width, height);
                            }
                        }
                    },
                    {
                        xtype: "gridpanel",
                        reference: "ddsDrWqGrid",
                        width: 320,
                        border: true,
                        columns: [{
                                header: '采样时间',
                                dataIndex: 'spt',
                                align: 'center',
                                flex: 1,
                                // renderer: Ext.util.Format.dateRenderer('Y-m-d H:i:s')
                                renderer: function(value) {
                                    if (/\.0$/.test(value)) {
                                        return value.substring(0, 19);
                                    } else {
                                        return value;
                                    }
                                }
                            },
                            {
                                header: '水温(&#8451;)',
                                dataIndex: 'wt',
                                align: 'center',
                                flex: 1
                            }
                        ],
                        store: {
                            type: "ddsDrWq",
                            listeners: {
                                datachanged: function(data, eOpts) {
                                    var highchart = Ext.ComponentQuery.query('#inforChart5')[0].highchart;
                                    var categoriesData = [],
                                        series = [];
                                    var yAxis = {
                                        title: {
                                            text: '水温(℃)'
                                        },
                                    };

                                    var norm = Ext.getCmp('norm').getValue();
                                    var storeData = data.getData().items;
                                    switch (norm) {
                                        case "1":
                                            categoriesData = [];
                                            yAxis.title.text = '水温(℃)';
                                            series = [{
                                                name: "水温(℃)",
                                                connectNulls: true,
                                                data: []
                                            }];
                                            for (var i = 0; i < storeData.length; i++) {
                                                categoriesData.push(Ext.util.Format.date(storeData[i].data.spt, "Y-m-d"));
                                                series[0].data.push(storeData[i].data.wt ? Number(storeData[i].data.wt) : ""); //水温
                                            }
                                            break;
                                        case "2":
                                            categoriesData = [];
                                            yAxis.title.text = 'PH值(无量纲)';
                                            series = [{
                                                name: "PH值(无量纲)",
                                                connectNulls: true,
                                                data: []
                                            }];
                                            for (var i = 0; i < storeData.length; i++) {
                                                categoriesData.push(Ext.util.Format.date(storeData[i].data.spt, "Y-m-d"));
                                                series[0].data.push(storeData[i].data.ph ? Number(storeData[i].data.ph) : ""); //PH值
                                            }
                                            break;

                                        case "3":
                                            categoriesData = [];
                                            yAxis.title.text = '溶解氧(mg/L)';
                                            series = [{
                                                name: "溶解氧(mg/L)",
                                                connectNulls: true,
                                                data: []
                                            }];
                                            for (var i = 0; i < storeData.length; i++) {
                                                categoriesData.push(Ext.util.Format.date(storeData[i].data.spt, "Y-m-d"));
                                                series[0].data.push(storeData[i].data.codcr ? Number(storeData[i].data.codcr) : ""); //溶解氧
                                            }
                                            break;

                                        case "4":
                                            categoriesData = [];
                                            yAxis.title.text = '高猛酸盐指数(mg/L)';
                                            series = [{
                                                name: "高猛酸盐指数(mg/L)",
                                                connectNulls: true,
                                                data: []
                                            }];
                                            for (var i = 0; i < storeData.length; i++) {
                                                categoriesData.push(Ext.util.Format.date(storeData[i].data.spt, "Y-m-d"));
                                                series[0].data.push(storeData[i].data.codmn ? Number(storeData[i].data.codmn) : ""); //高猛酸盐指数
                                            }
                                            break;

                                        case "5":
                                            categoriesData = [];
                                            yAxis.title.text = '氨氮(mg/L)';
                                            series = [{
                                                name: "氨氮(mg/L)",
                                                connectNulls: true,
                                                data: []
                                            }];
                                            for (var i = 0; i < storeData.length; i++) {
                                                categoriesData.push(Ext.util.Format.date(storeData[i].data.spt, "Y-m-d"));
                                                series[0].data.push(storeData[i].data.nh3n ? Number(storeData[i].data.nh3n) : ""); //氨氮
                                            }
                                            break;

                                        case "6":
                                            categoriesData = [];
                                            yAxis.title.text = '总磷(mg/L)';
                                            series = [{
                                                name: "总磷(mg/L)",
                                                connectNulls: true,
                                                data: []
                                            }];
                                            for (var i = 0; i < storeData.length; i++) {
                                                categoriesData.push(Ext.util.Format.date(storeData[i].data.spt, "Y-m-d"));
                                                series[0].data.push(storeData[i].data.tp ? Number(storeData[i].data.tp) : ""); //总磷
                                            }
                                            break;
                                    }
                                    highchart.update({
                                        xAxis: {
                                            categories: categoriesData,
                                        },
                                        series: series,
                                        yAxis: yAxis
                                    });
                                }
                            }
                        },
                        bbar: {
                            xtype: "pagingtoolbar",
                            autoLoad: true,
                            // displayInfo: true,
                            // displayMsg: "显示从第{0}条数据到第{1}条数据，共{2}条数据",
                            // emptyMsg: "没有记录"
                        },
                        stripeRows: true, //斑
                        columnLines: true //行线
                    }
                ]
            }
        ]
    }
});